<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
    <head>
        <meta charset="UTF-8">
        <link rel="stylesheet" href="../../../css/personimfcss/basicimf.css">
        <script src="http://cdn.staticfile.org/jquery/3.6.0/jquery.js"></script>
        <script th:inline="javascript">
        var userid = [[${userid}]];
            var userid;
            var a=1;
            var b=1;
            var c=1;
            var d=1;
            var e=1;
            $(function(){
                $.ajax({
                    url:'getUser.do?userid='+userid,
                    success:function(data){//data服务器返回的数据
                        userid=data.userid;
                        username=$("<p>"+data.username+"</p>")
                        $("#username").append(username)

                        stunumber=$("<p>"+data.stunumber+"</p>")
                        $("#stunumber").append(stunumber)

                        really=$("<p>"+data.realname+"</p>")
                        $("#really").append(really)
                        sex=$("<p>"+data.sex+"</p>")
                        $("#sex").append(sex)
                        totalgrade=$("<p>"+data.totalgrade+"</p>")
                        $("#totalgrade").append(totalgrade)
                        age=$("<input id=\'age1\' onblur=\'showage()\' type=\'text\' value=\'"+data.age+"\'>"+
                            "<p id=\'showage\' style=\'font-size: small;color: red;display: none\'>请输入正确的年龄</p>")
                        $("#age").append(age)

                        phone=$("<input id=\'phone1\' onblur=\'showphone()\' type=\'text\' value=\'"+data.phone+"\'>"+
                            "<p id=\'showphone\' style=\'font-size: small;color: red;display: none\'>请输入正确的手机号</p>")
                        $("#phone").append(phone)

                        email=$("<input id=\'email1\' onblur=\'shwoemail()\' type=\'email\' value=\'"+data.email+"\'>" +
                            "<p id=\'showemail\' style=\'font-size: small;color: red;display: none\'>请输入正确的邮箱</p>")
                        $("#email").append(email)

                        major=$("<input id=\'major1\' onblur=\'showmajor()\' type=\'text\' value=\'"+data.mname+"\'>" +
                            "<p id=\'showmajor\' style=\'font-size: small;color: red;display: none\'>请输入正确的专业</p>")
                        $("#major").append(major)

                        grade=$("<input id=\'grade1\' onblur=\'showage()\' type=\'text\' value=\'"+data.grade+"\'>" +
                            "<p id=\'showgrade\' style=\'font-size: small;color: red;display: none\'>请输入正确的年级</p>")
                        $("#grade").append(grade)

                        collage=$("<input id=\'collage1\' onblur=\'showcollege()\' type=\'text\' value=\'"+data.cname+"\'>" +
                            "<p id=\'showcollege\' style=\'font-size: small;color: red;display: none\'>请输入正确的学院</p>")
                        $("#collage").append(collage)


                    }
                });

            });
            //全部正确后提交
            function f() {
                if (a == 1 && b == 1 && c == 1 && d == 1 && e == 1) {
                    var age = $("#age1").val();
                    var phone = $("#phone1").val();
                    var email = $("#email1").val();
                    var major = $("#major1").val();
                    var grade = $("#grade1").val();
                    var collage = $("#collage1").val();
                    var arry = [age, phone, email, major, grade, collage, userid]
                    var Users = arry.join(',');
                    $.ajax({
                        url: 'ChangeUser.do?user='+Users,
                        success: function (data) {//data服务器返回的数据
                        }
                    })
                    $('#background').css('display', 'block');
                    $('#chenggong').css('display', 'inline');
                    $('#shibai').css('display', 'none');
                }
                else {
                    $('#background').css('display', 'block');
                    $('#shibai').css('display', 'inline');
                    $('#chenggong').css('display', 'none');

                }
            }
            //验证年龄
            function showage() {
                var age=$("#age1").val();
                var ages=/^(?:[1-9][0-9]?|1[01][0-9]|120)$/;
                if (!ages.test(age)) {
                    a=0;
                    $('#showage').css('display', 'inline');
                }
                else {
                    a=1;
                    $('#showage').css('display', 'none');
                }

            }
            //验证电话
            function showphone() {
                var myReg = /^((13[0-9])|(14[5-9])|(15([0-3]|[5-9]))|(16[6-7])|(17[1-8])|(18[0-9])|(19[1|3])|(19[5|6])|(19[8|9]))\d{8}$/;
                var use5=$("#phone1").val();
                if(use5!=""&&!myReg.test(use5))
                {
                    b=0;
                    $('#showphone').css('display', 'inline');
                }
                else {
                    b=1;
                    $('#showphone').css('display', 'none');
                }
            }
            //验证eamil
            function shwoemail() {
                var reg =/^\w+@\w+\.\w+$/;
                var email=$("#email1").val();
                if (email!=""&&!reg.test(email)) {
                    c==0;
                    $('#showemail').css('display', 'inline');
                }
                else {
                    c=1;
                    $('#showemail').css('display', 'none');
                }

            }
            function showmajor() {
                var major=$("#major1").val();
                $.ajax({
                    url: 'getMajor.do?mname='+major,
                    success: function (data) {
                        if (data==0){
                            d==0;
                            $('#showmajor').css('display', 'inline');
                        }
                        else {
                            d=1;
                            $('#showmajor').css('display', 'none');
                        }
                    }
                })

            }
            function showcollege() {
                var collage=$("#collage1").val();
                var major=$("#major1").val();
                $.ajax({
                    url: 'getMacollege.do?mname='+major+'&cname='+collage,
                    success: function (data) {
                        if (data==0){
                            e=0;
                            $('#showcollege').css('display', 'inline');
                        }
                        else {
                            e=1;
                            $('#showcollege').css('display', 'none');
                        }

                    }
                })
            }
        </script>
    </head>
    <body>
        <div class="zong">
            <form>
                <table>
                    <tr><td>用户名</td><td id="username"></td></tr>
                    <tr><td>学号</td><td id="stunumber"></td></tr>
                    <tr><td>真实姓名</td><td id="really"></td></tr>
                    <tr><td>性别</td><td id="sex"></td></tr>
                    <tr><td>积分</span></td><td id="totalgrade"></td></tr>
                    <tr><td><span style="color: #FF0000;">*</span><span style="color: gray;">年龄</span></td><td id="age"></td></tr>
                    <tr><td><span style="color: #FF0000;">*</span><span style="color: gray;">手机号</span></td><td id="phone"></td></tr>
                    <tr><td><span style="color: #FF0000;">*</span><span style="color: gray;">邮箱</span></td><td id="email"></td></tr>
                    <tr><td><span style="color: #FF0000;">*</span><span style="color: gray;">专业</span></td><td id="major"></td></tr>
                    <tr><td><span style="color: #FF0000;">*</span><span style="color: gray;">年级</span></td><td id="grade"></td></tr>
                    <tr><td><span style="color: #FF0000;">*</span><span style="color: gray;">学院</span></td><td id="collage"></td></tr>
                </table>
                <input type="button" value="保存" id="h" onclick="f()">
                <div class="tanchuang">
                    <!-- 弹窗内容开始 -->
                    <div id="background" class="back" >
                        <div id="div1" class="content">
                            <div id="close">
                                <span id="close-button">×</span>
                                <h2>提示框</h2>
                            </div>
                            <div id="div2" >
                                <h3 style="text-align: center;display: none" id="shibai">保存信息失败，请检查是否填写正确</h3>
                                <h3 style="text-align: center;display: none" id="chenggong">保存信息成功</h3>
                            </div>
                            <h3 id="foot"></h3>
                        </div>
                    </div>
                    <script>
                        var div = document.getElementById('background');
                        var close = document.getElementById('close-button');
                        close.onclick = function close() {
                            div.style.display = "none";
                        }

                        window.onclick = function close(e) {
                            if (e.target == div) {
                                div.style.display = "none";
                            }
                        }
                    </script>

                </div>
            </form>
        </div>
    </body>
</html>